<!DOCTYPE html>
<html lang="en-US">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="icon" type="image/png" href="/favicon.png" />
    <style type="text/css">
        html,body{
            font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;
            margin:0px;
            padding:0;
            width:100%;
            height:100%;
            overflow : auto;
        }
        body {
            background-color: #888888;
        }
        h1 {
            margin: 0px;
            padding: 0px;
            color : orange;
            font-weight : 800;
            font-size : 80px;
            font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;
        }
        p.subtitle{
            margin: 0px;
            padding: 0px;
            color : orange;
            font-weight : 800;
            font-size : 30px;
            font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;
        }
        div.window {
            font-weight : 800;
            font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;
            position: absolute;;padding: 0px;
            margin: 0px;
            /*display: block;*/
            border: 2px solid #000000;
            padding: 0px;
            border-radius: 8px 8px;
            background-color: #FFFFFF;
            width : 400px ;
            height : 600px ;
        }
        .window-title{
            color:#FFFFFF;
            background-color:#404040;
            font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;
            font-size:16pt;
            cursor:move;
            height:20px;
            padding:4px;
        }
        .window-button {
            color:#FFFFFF;
            background-color:#404040;
            font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;
            font-size:16pt;
            cursor:move;
            height:20px;
            padding:4px;
        }
        .window-url {
            color:#FFFFFF;
            background-color:#404040;
            font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;
            font-size:16pt;
            cursor:move;
            height:30px;
            padding:4px;
        }
        .window-body {
            font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;
            position: absolute;
            margin: 0px;
            /*display: block;*/
            padding: 0px;
            border-radius: 8px 8px;
            background-color: #FFFFFF;
            overflow : hidden;
            left : 0px;
            right : 0px;
            top : 95px;
            bottom: 0px;
        }
        input[type=button] {
            background: -moz-linear-gradient(#ffffff, #dfdfdf);
            background: -ms-linear-gradient(#ffffff, #dfdfdf);
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #dfdfdf));
            background: -webkit-linear-gradient(#ffffff, #dfdfdf);
            background: -o-linear-gradient(#ffffff, #dfdfdf);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dfdfdf');
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dfdfdf')";
            background: linear-gradient(#ffffff, #dfdfdf);
            border-radius: 5px 5px;
        }
    </style>

    <script type="text/javascript">
        //http://www.jb51.net/article/36496.htm
        String.prototype.endWith=function(s){
            if(s==null||s==""||this.length==0||s.length>this.length)
                return false;
            if(this.substring(this.length-s.length)==s)
                return true;
            else
                return false;
            return true;
        }
        String.prototype.startWith=function(s){
            if(s==null||s==""||this.length==0||s.length>this.length)
                return false;
            if(this.substr(0,s.length)==s)
                return true;
            else
                return false;
            return true;
        }

        //modified from http://www.cnblogs.com/dolphinX/p/3290520.html
        var Dragging=function(validateHandler){
            var draggingObj=null;
            var diffX=0;
            var diffY=0;

            function mouseHandler(e){
                switch(e.type){
                    case 'mousedown':
                        draggingObj=validateHandler(e);//验证是否为可点击移动区域
                        if(draggingObj!=null){
                            diffX=e.clientX-draggingObj.offsetLeft;
                            diffY=e.clientY-draggingObj.offsetTop;
                        }
                        break;

                    case 'mousemove':
                        if(draggingObj){
                            draggingObj.style.left=(e.clientX-diffX)+'px';
                            draggingObj.style.top=(e.clientY-diffY)+'px';
                        }
                        break;

                    case 'mouseup':
                        draggingObj =null;
                        diffX=0;
                        diffY=0;
                        break;
                }
            };

            return {
                enable:function(){
                    document.addEventListener('mousedown',mouseHandler);
                    document.addEventListener('mousemove',mouseHandler);
                    document.addEventListener('mouseup',mouseHandler);
                },
                disable:function(){
                    document.removeEventListener('mousedown',mouseHandler);
                    document.removeEventListener('mousemove',mouseHandler);
                    document.removeEventListener('mouseup',mouseHandler);
                }
            }
        }

        function getDraggingDialog(e){
            var target=e.target;
            while(target && target.className.indexOf('window-title')==-1){
                target=target.offsetParent;
            }
            if(target!=null){
                return target.offsetParent;
            }else{
                return null;
            }
        }


        function if_endWith_method(roota){
            if(roota.endWith("/index.html") ||roota.endWith("/method_upload") ||roota.endWith("/method_new_folder") ||roota.endWith("/method_down_all")||roota.endWith("/method_up_all")||roota.endWith("/method_git_clone")||roota.endWith("/method_cache")){
                return true;
            }
            return false;
        }

        function method_gotomain(){
            var roota ="/FILE/";
            document.getElementById("innerframe").src = roota;
        };


        function method_back(){
            var roota =  window.frames["innerframe"].document.location.pathname;
            while(roota.endWith("/")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            roota = roota.substring(0,roota.lastIndexOf("/"));
            while(roota.endWith("/")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            roota += "/";
            document.getElementById("innerframe").src = roota;
        };

        function method_upload(){
            var roota =  window.frames["innerframe"].document.location.pathname;

            if(roota.endWith("//")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            if(if_endWith_method(roota)){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            while(roota.endWith("/")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            roota = roota +"/method_upload";
            document.getElementById("innerframe").src = roota;
        };
        function method_new_folder(){
            var roota = window.frames["innerframe"].document.location.pathname;

            if(roota.endWith("//")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            if(if_endWith_method(roota)){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            while(roota.endWith("/")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            roota = roota +"/method_new_folder";
            document.getElementById("innerframe").src = roota;
        };
        function method_git_clone(){
            var roota = window.frames["innerframe"].document.location.pathname;

            if(roota.endWith("//")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            if(if_endWith_method(roota)){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            while(roota.endWith("/")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            roota = roota +"/method_git_clone";
            document.getElementById("innerframe").src = roota;
        };
        function method_cache(){
            var roota = window.frames["innerframe"].document.location.pathname;

            if(roota.endWith("//")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            if(if_endWith_method(roota)){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            while(roota.endWith("/")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            roota = roota +"/method_cache";
            document.getElementById("innerframe").src = roota;
        };
        function method_down_all(){
            var roota =  window.frames["innerframe"].document.location.pathname;
            if(roota.endWith("//")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            if(if_endWith_method(roota)){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            while(roota.endWith("/")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            roota = roota +"/method_down_all.py";
            document.getElementById("innerframe").src = roota;
        };
        function method_up_all(){
            var roota =  window.frames["innerframe"].document.location.pathname;
            if(roota.endWith("//")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            if(if_endWith_method(roota)){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            while(roota.endWith("/")){
                roota = roota.substring(0,roota.lastIndexOf("/"));
            }
            roota = roota +"/method_up_all.py";
            document.getElementById("innerframe").src = roota;
        };

        function keydownEvent() {
            var e = window.event || arguments.callee.caller.arguments[0];
            if (e && e.keyCode == 13 ) {
                document.getElementById("innerframe").src = location.protocol +"//" + location.host + "/FILE"+document.getElementById("URL").value;
            }
        };

        function bodyInit(){
            document.getElementById("innerframe").src = location.protocol +"//" + location.host + "/FILE/" ;

            //if the html is in a inframe, or is on a mobile device.
            if(window.location!=top.location||(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent))){
                document.getElementById("titlewords").style.display="none";
                document.getElementById("mainWindow").style.width="100%";
                document.getElementById("mainWindow").style.height="100%";
            }else{
                Dragging(getDraggingDialog).enable();
            }

        }
        function setURL(strURL){
            document.getElementById("URL").value = strURL ;
        }
    </script>
    <title>EXsimple</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
    <meta name="description" content="convenient way to set up a simple file-server, provided by XenoAmess.">
</head>
<body onload = "bodyInit()">
<div id="titlewords">
    <h1>EXsimple</h1>
    <div>
        <p class = "subtitle">Vconvenient way to set up a simple file-server, provided by XenoAmess.</h1>
        <p class = "subtitle">2020/03/18</h1>
        <p class = "subtitle">github : <a target="_blank" href="https://github.com/XenoAmess/EXsimple">https://github.com/XenoAmess/EXsimple/</a></p>
    </div>
</div>
<div id="mainWindow" style = "clear:both" class = "window">
    <div class = "window-title">EXsimple</div>
    <div class = "window-button">
        <input type="button" value = "main" id = "method_gotomain" onclick = "method_gotomain()"/>
        <input type="button" value = "back" id = "method_back" onclick = "method_back()"/>
        <input type="button" value = "upload" id = "method_upload" onclick = "method_upload()"/>
        <input type="button" value = "new-folder" id = "method_new_folder" onclick = "method_new_folder()"/>
        <input type="button" value = "git-clone" id = "method_git_clone" onclick = "method_git_clone()"/>
        <input type="button" value = "cache" id = "method_cache" onclick = "method_cache()"/>
        <!--
            <br/>
            <input type="button" value = "down-all" id = "method_down_all" onclick = "method_down_all()"/>
            <input type="button" value = "up-all" id = "method_up_all" onclick = "method_up_all()"/>
        -->
    </div>
    <div class = "window-url">
        <input type="text" name="URL" id ="URL" value="" onKeyDown="keydownEvent()"  style="width:95%"/>
    </div>
    <div class = "window-body">
        <iframe id = "innerframe" name = "innerframe" target = "_self" frameborder="false"  width = "100%" height = "100%" style="border:none;"   allowtransparency="false" scrolling="auto" style="overflow-x:scroll; overflow-y:hidden;"></iframe>
    </div>
</div>
</body>
</html>
